<template>
  <div>
    <el-row>
      <el-col :span="3">
        <div class="grid-content bg-purple-light" style="background-color: #EEEEEE; height: 100vh">
        <friend-and-group></friend-and-group>
        </div>
      </el-col>
      <el-col :span="21">
        <div class="grid-content bg-purple">
          <div style="height: 70vh; border-bottom: #1e1e1e 1px solid"><main-region></main-region></div>
          <div><chat-message></chat-message></div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import UserDetail from "@/views/reporter/room/compoent/UserDetail";
import FriendAndGroup from "@/views/reporter/room/compoent/FriendAndGroup";
import MainRegion from "@/views/reporter/room/compoent/MainRegion";
import ChatMessage from "@/views/reporter/room/compoent/ChatMessage";
export default {
  name: "room",
  components: {UserDetail,ChatMessage, MainRegion, FriendAndGroup},
}
</script>

<style scoped>

</style>
